<template>
  <div>
    <h1>Footer ---{{ count }}</h1>
    <h2>电影列表</h2>
    <button @click="getMovieList">获取</button>
    <ul>
      <li v-for="movie in movieList" :key="movie.tvId">
        {{ movie.albumName }}
      </li>
    </ul>
    <h3>我喜欢的电影</h3>
    <ul>
      <li v-for='item in getMovie' :key='item.tvId'>{{item.albumName}}</li>
    </ul>
  </div>
</template>

<script>
import { mapActions, mapGetters, mapState } from 'vuex'
export default {
    name:'Footer',
    mounted() {
      console.log(this.$store)
    },
    computed:{
        ...mapState('count',['count','movieList']),

        // getter
        // getMovie(){
        //   return this.$store.getters['count/myMovie']
        // }
        ...mapGetters('count',{getMovie:'myMovie'})

    },
    methods:{
      // action
      // getMovieList(){
      //   this.$store.dispatch('count/getMovie')
      // },
      ...mapActions('count',{getMovieList:'getMovie'})
      
    }
}
</script>

<style>
</style>